<template>
  <div class="wrap">
    <template>
      <el-tabs v-model="curTab" @tab-click="setCurTab">
        <el-tab-pane name="TabParameter" :label="$t('message.PartModification.parameterTab')">
          <div v-if="variableList && variableList.length > 0">
            <div v-for="variable in variableList" class="d-flex align-items-center">
              <label class="el-form-item__label">{{ variable.variableName }}：</label>
              <base-input-number v-model="variable.expression" @change="changeValue(variable)"/>
            </div>
          </div>
        </el-tab-pane>
<!--        <el-tab-pane name="TabFeature" :label="$t('message.PartModification.featureTab')">-->
<!--          <div class="d-flex align-items-center">-->
<!--            <label class="el-form-item__label">{{$t('message.PartModification.newPartName')}}：</label>-->
<!--            <el-input v-model="newPartName" />-->
<!--          </div>-->
<!--        </el-tab-pane>-->
      </el-tabs>
    </template>
    <div class="btn">
      <el-button v-if="curTab === tabOptions[1]"
        type="primary"
        size="small"
        @click="confirm"
      >
        {{ $t('message.HoleCmd.confirm') }}
      </el-button>
      <el-button v-else
              type="primary"
              size="small"
              :disabled="variableList.length <= 0"
              @click="update"
      >
        {{ $t('message.PartModification.update') }}
      </el-button>
      <el-button
        size="small"
        @click="close"
      >
        {{ $t('message.HoleCmd.close') }}
      </el-button>
    </div>
  </div>
</template>

<script>
  import DialogMixin from "../DialogMixin";
  import {partDeformationCommand} from "../../../Command/PartDeformationCommand";

export default  {
  mixins: [DialogMixin],
  name: "CmdDlgPartDeformation",
  data() {
    return {
      isInit: false,
      tabOptions: ["TabParameter", "TabFeature"],
      curTab: "TabParameter",
      newPartName: "",
      variableList: {},
      variable: null,
      variableCopy: null,
      variableObject: {
        id: 0,
        variableName: '', // 去除单引号的名称，用于前端引用
        fullName: '', // 内核返回的原名称，包含单引号
        expression: "",
        variableValue: 0,
        systemValue: 0,
        variableType: "",
        variableUnit: "",
        variableDescription: "",
        status: 0, //0 -- new, 1 -- normal
        createType: 0, // 0 -- 未命名； 1 -- 已命名变量
      },
    }
  },

  methods: {
    setCurTab(tab) {
      if (tab.index === "1"){

        this.curTab = this.tabOptions[1];
        this.switchQuery("cutPath");
      }else {

        this.curTab = this.tabOptions[0];
        this.switchQuery("lineList");
      }

      // this.changeCommon();
    },
    changeValue(variable){
      let result = variable.expression;
      if (result <= 0) {
        variable.expression = variable.variableValue;
        result = variable.variableValue;
      }
      result = Math.abs(result) < 1e-10 ? 0 : result;
      result = result ? parseFloat(result).toFixed(3) : 0;
      variable.variableValue = result;
    },
    // clone(varObject){
    //   if (varObject === undefined) {
    //     return null;
    //   }
    //   let newVariable = this.variableObject;
    //   Object.keys(varObject).forEach(key => {
    //     newVariable[key] = varObject[key];
    //   });
    //   return newVariable;
    // },
    // focus(variable, index){
    //   this.variable = this.clone(this.variableList[index]);
    //   this.variableCopy = this.clone(variable);
    // },
    update(){
      if (this.variable === undefined || this.variableCopy === undefined){
        return;
      }
      // let params = {
      //   newVariable: this.variable,
      //   oldVariable: this.variableCopy,
      // }
      partDeformationCommand.executePartDeformationCommand(this.variableList,cb=>{
        this.close();
      });
    },
    confirm(){
      let params = {
        type: this.curTab === this.tabOptions[0] ? 0 : 1,
        selectedTemplate: this.selectedTemplate,
        docName: this.newPartName,
      }
      partDeformationCommand.executePartDeformationCommand(params,cb=>{
        this.close();
      });
    },
    close(){
      partDeformationCommand.closeActiveCmd();
    },
    changePluginContainerHeight() {
      if (this.isInit) {
        partDeformationCommand.changePluginContainerHeight({
          minWidth: this.$el.clientWidth,
          maxHeight: this.$el.clientHeight
        })
      }
    },
    changeParamTemplate(index) {
      if (this.parametricTemplates.length > index){
        this.selectedTemplate = this.parametricTemplates[index];
      }
    },
    // changeValue(parameter){
    //   parameter.valu
    // }
    // switchQuery(name) {
    //   for (const key in this.params.queryListActiveMap) {
    //     this.params.queryListActiveMap[key] = key === name ? 1 : 0;
    //   }
    // },
  },

  mounted() {
    partDeformationCommand.init(500, 250, 200, () => {
      this.isInit = true;
      partDeformationCommand.getParameters(variableList => {
        let list = variableList.filter(v => !isNaN(v.expression) && (v.createType === 1 || v.createType === 0));
        this.variableList = list.map(v => {
          v.expression = parseFloat(parseFloat(v.expression).toFixed(2));
          return v;
        })
      });
    });
  },

  computed: {

  },

  watch: {

  },
}
</script>

<style scoped>
.wrap {
  font-size: 12px;
}

label {
  color: var(--text-color1);
}

</style>